<template>
    <div>
        <h1>会员等级显示</h1>


        名称：<input type="text" v-model="Cha.LeveName">
        权益:
        <select v-model="Cha.QYId">
            <option value="0">请选择</option>
            <option v-for="a in bang" :value="a.QYId">{{a.QYName}}</option>
        </select>
        <input type="button" value="查询" @click="Show">
        <input type="button" value="重置" @click="Chong">
        <a href="/LeveAdd">会员等级添加</a>
        <a href="/QYShow">显示权益信息</a>
        <table class="table">
            <thead>
                <tr>
                    <td>等级编号</td>
                    <td>等级名称</td>
                    <td>登记状态</td>
                    <td>权益名称</td>
                    <td>操作</td>
                </tr>
            </thead>
            <tbody v-for="a in data">
                <tr>
                    <td>{{a.LeveId}}</td>
                    <td>{{a.LeveName}}</td>
                    <td>{{a.LeveState?"启用":"禁用"}}</td>
                    <td>{{a.QYName}}</td>
                    <td>
                        <input type="button" value="修改状态" @click="UpdState(a.LeveId)">
                    </td>
                </tr>
            </tbody>
        </table>
        一共{{page.zys}}页，一共{{page.zhs}}行，第{{Cha.Pageindex}}页，每页{{Cha.PageSize}}行



        <input type="button" value="首页"@click="fy(1)">
        <input type="button" value="上一页"@click="fy(2)">
        <input type="button" value="下一页"@click="fy(3)">
        <input type="button" value="尾页"@click="fy(4)">
    </div>
</template>

<script setup lang="ts">
import { ref ,onMounted} from 'vue';
import axios from 'axios';
import { useRouter } from 'vue-router';
onMounted(()=>{
    Show()
    Xia()
})
const Chong = ()=>{
    Cha.value.LeveName="",
    Cha.value.QYId=0,
    Show()
}
//下拉框
const bang =ref([{
    "QYId": 0,
    "QYName": "",
    "QYState": true,
    "QYIsDelete": true
}])

const Xia = ()=>{
    axios.get('https://localhost:7174/api/Leve/Xia').then(res=>{
        bang.value = res.data;
    })
}
const data = ref([{
   "LeveId": 0,
      "LeveName": "",
      "LeveState": true,
      "QYId": 0,
      "QYName": ""
}])

const Cha =ref({
    Pageindex:1,
    PageSize:2,
    LeveName:"",
    QYId:0,
})




const page = ref({
    zhs:0,
    zys:0
})

const fy = (e:any)=>{
    if(e==1){
        Cha.value.Pageindex=1;
        Show();
    }

    if(e==2){
        if(Cha.value.Pageindex>1){
            Cha.value.Pageindex-=1;
            Show();
        }
    }
    if(e==3){
        if(Cha.value.Pageindex<page.value.zys){
            Cha.value.Pageindex+=1;
            Show();
        }
    }



    if(e==4){
        Cha.value.Pageindex=page.value.zys;
        Show();
    }
}
const Show=()=>{
    axios.get('https://localhost:7174/api/Leve/LeveShow',{params:Cha.value}).then(res=>{
        data.value = res.data.list
        page.value.zhs=res.data.count;
        page.value.zys=Math.ceil(page.value.zhs/Cha.value.PageSize)
    })
}

//修改状态


const UpdState = (e:any)=>{
    if(confirm('确定修改吗？')){
        axios.get('https://localhost:7174/api/Leve/UpdState',{params:{LeveId:e}}).then(res=>{
            if(res.data>0){
                alert('修改成功');
                Show()
            }
            else{
                alert('修改失败')
            }
        })
    }
    
}




</script>

<style scoped>

</style>